<!-- subpkg_consult/order_list/components/order-list.vue -->
<script lang="ts" setup>
  import { ref } from 'vue'
  import List from './components/list.vue'
  const tabIndex = ref(1)
  const orderTabs = ref([
    { label: '问医生', rendered: false },
    { label: '极速问诊', rendered: true },
    { label: '开药问诊', rendered: false },
  ])

  function handleTabChange(i: number) {
    tabIndex.value = i
    orderTabs.value[i].rendered = true
  }
</script>

<template>
  <view class="consult-page">
    <view class="consult-status-tabs">
      <custom-tabs :data="orderTabs" @change="handleTabChange"></custom-tabs>
    </view>
    <!-- 按需加载的同时确定创建后不销毁，不重复创建 -->
    <view v-for="(item, index) in orderTabs" v-show="index === tabIndex">
      <list v-if="item.rendered" :type="tabIndex + 1"></list>
    </view>
  </view>
</template>

<style lang="scss">
  @import './index.scss';
</style>
